<%@ page language="java" pageEncoding="utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ taglib uri="http://java.fckeditor.net" prefix="fck" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>
    	<s:if test="id eq null">
			发布产品
		</s:if>
		<s:if test="id neq null">
			修改产品
		</s:if>
    </title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
<style type="text/css">
	.input{width:150px;}
	select{width:150px;}
	td{
		white-space:nowrap;
		line-height: 150%;
	}
</style>
<link href="${pageContext.request.contextPath}/js/validate/jquery.validate.css" type="text/css" rel="stylesheet" />
<script src="${pageContext.request.contextPath}/js/jquery.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/js/validate/jquery.validate.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/js/validate/messages_cn.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
	//聚焦第一个输入框
	$("#name").focus();
	//为inputForm注册validate函数
	$("#inputForm").validate({
		rules: { 
        		name: "required",
        		seriesId: "required",
        		seriesNameId: "required",
        		online: "required",
        		price: {
        			required: true,
        			number: true,
        			min: 1.0
        		},
        		spec: "required",
        		doc: "required"
		}
	});
});

//去左右空格; 
function trim( text ){
		return (text || "").replace( /^\s+|\s+$/g, "" );
}

var i = 1;
function addfile(objId){
	var obj = document.getElementById(objId);
	var arr = document.getElementsByTagName("input");
	var len = arr.length-1;
	
	for(var j=0;j<len;j++){
		if(arr[j].type == "file" && arr[j]!=obj && arr[j].value == obj.value){
			alert("当前目录下已有相同文件，无须重复上传");
			var n = objId.substring(objId.indexOf("c")+1,objId.length);
			
			var k = arr[j].id.substring(arr[j].id.indexOf("c")+1,arr[j].id.length);
			n = n > k ? n : k;
			deletefile("div" + n);
			return;
		}
	}
	
	var oDiv = document.createElement("div");	
	oDiv.id = "div" + i;
	var sHtml = '<input type="file" id="doc'+i+'" name="doc" onchange="addfile(\'doc'+i+'\');" style="width:500px"/>&nbsp;&nbsp;&nbsp;<a href="javascript:deletefile(\'div'+i+'\');"/>移除</a>';
	oDiv.innerHTML = sHtml;
	
	var spanObj = document.getElementById("fileSpan");
	spanObj.appendChild(oDiv);
	
	i++;
}

function deletefile(objId){
	var spanObj = document.getElementById("fileSpan");
	spanObj.removeChild(document.getElementById(objId));	
	//document.parentNode.removeChild();
}
</script>
</head>
<body>
<s:form id="inputForm" action="product-list!saveOrUpdate.do" method="post" ENCTYPE="multipart/form-data" theme="simple">
 <table width="100%" border="0" cellspacing="1" cellpadding="0" bgcolor="#E1E1E1">
	<tr bgcolor="#ffffff"  class="tr" width="100%">	
	    <td align="center"> 
   			<table width="100%" >
   				<tr>
					<td colspan="2" align="center">
						<s:if test="id eq null">
	    					发布产品
	    				</s:if>
	    				<s:if test="id neq null">
	    					修改产品
	    				</s:if>
					</td>
				</tr>
				<tr>
					<td align="right" width="6%">
						产品名称：
					</td>
					<td align="left">
						<s:textfield id="name" name="name" cssClass="input"/>
					</td>
				</tr>
				<tr>
					<td align="right">
						编号：
					</td>
					<td align="left">
						<s:textfield name="no" cssClass="input"/>
					</td>
				</tr>
				<tr>
					<td align="right">
						系列：
					</td>
					<td align="left">
						<s:select label="系列" 
							id="seriesId"
							name="seriesId" 
							headerKey=""
							headerValue="请选择系列"
							list="seriesList" 
							listKey="id" 
							listValue="value"/>
					</td>
				</tr>
				<tr>
					<td align="right">
						品名：
					</td>
					<td align="left">
						<s:select label="品名" 
							id="seriesNameId"
							name="seriesNameId" 
							headerKey=""
							headerValue="请选择品名"
							list="seriesNameList" 
							listKey="id" 
							listValue="value"/>
					</td>
				</tr>
				<tr>
					<td align="right">
						上下架标记：
					</td>
					<td align="left">
						<s:select label="上下架标记"
					       id="online"
					       name="online"
					       headerKey="" headerValue="请选择上下架标记"
					       list="#{'1':'上架', '2':'下架'}"
						   required="true"/>	
					</td>
				</tr>
				<tr>
					<td align="right">
						销售单价(元/盒)：
					</td>
					<td align="left">
						<s:textfield name="price" cssClass="input"/>
					</td>
				</tr>	
				<tr>
					<td align="right">
						规格：
					</td>
					<td align="left">
						<s:textfield name="spec" cssStyle="width:428px"/>
					</td>
				</tr>
				<tr>
					<td align="right" valign="top">
						产品图片：
					</td>
					<td align="left" valign="top">
						<input type="file" id="doc0" name="doc" onchange="addfile('doc0');" style="width:500px"/>
						<span id="fileSpan"><div></div></span>
					</td>
				</tr>
				<tr>
					<td align="right" valign="top">
						详细说明：
					</td>
					<td align="left" valign="top">
						<fck:editor instanceName="detail" height="350" basePath="/common/fckeditor">
							<jsp:attribute name="value">
								<s:property value="detail" escape="false"/>
							</jsp:attribute>
						</fck:editor>
					</td>
				</tr>
				<tr>
	    			<td align="right">
	    				<input type="submit" value="提 交"/>		
	    			</td>
	    			<td>
	    				&nbsp;		
	    			</td>
	    		</tr>
			</table>
	    </td>
	 </tr>
</table>
<s:hidden name="id"/>
</s:form>
</body>
</html>
